<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        span{
            color: red;
        }
        .lv{
            color: rgb(13, 179, 13);
        }
    </style>
</head>
<body>
    <script>
        
    </script>
    <p>下载Vue <span>npm install -g @vue/cli</span></p>
    <p>安装完成之后，在命令行可以使用Vue命令命令创建一个vue项目，具体命令如下所示 <span>vue create hello</span></p>
<p>创建完成之后，让命令行工具进入到hello目录中，然后执行下面的命令启动项目： <span>npm run serve</span></p>





    <h3>第一天</h3>
    <p>按快捷键<span>windows</span>，输入<span>WF.msc</span>，打开防火墙</p>
    <p>在windows系统中，按快捷键<span>windows+R</span>可以打开{运行}窗口，然后输入“<span>cmd</span>”，再按回车，就可以打开windows的命令行窗口</p>
    <p><span>dir</span>：查看当前目录下的所有文件夹及文件</p>
    <p><span>cd ..</span>可以回到上级目录</p>
    <p><span>cd XX....</span>按<span>Tab</span>可以补全单词</p>
    <p><span>md music</span> 在当前目录中创建名为music的文件夹</p>
    <p><span>md c:\users\administrator\music</span> 创建这个路径里的文件夹music</p>
    <p><span>rd music</span> 在当前目录中删除名为music的文件夹</p>
    <p><span>rd c:\users\administrator\music</span> 删除这个路径里的文件夹music</p>
    
    <h3>第二天</h3>
    <p><span>shutdown</span> 输入命令候会关闭计算机</p>
    <p><span>shift+鼠标右键</span>，可以看到【在此处打开命令行窗口】</p>
    <a href="http://nodejs.cn/download/">node下载地址 - <span>http://nodejs.cn/download/</span></a>

    <h3>第三天</h3>
    <p><span>npm</span>是<span>node</span>包的管理器，作node项目需要时长下载第三方模块，通过npm下载第三方模块  下载第三方模块<span>npm instll jquery</span></p>
    <p><span>cnpm</span>  是淘宝为国内用户提供的，是npm的镜像，下载第三方包时，完全可以使用cnpm来代替npm</p>
    <p>安装cnpm <span>npm install -g cnpm --registry=https://registry.npm.taobao.org</span></p>
    <p>查询全局安装路径<span>npm list -g --depth=0</span></p>
    <p>http-server安装 <span>cnpm install http-server -g</span>加-g是全局安装，不加是本地安装 -g可以写前面也可以写后面<br>http-server模块提供<span>http-server</span>的命令，可以创建静态服务器</p>
    
    <h3>第四天</h3>
    <p>npm 初始化<span>npm init</span></p>
    <p><span>--save</span> 让我们把第三方依赖包把依赖关系记录到package.json里面<span>cnpm install jQuery --save</span></p>
    <p><span>npm install</span>npm便会根据packge.json文件中的记录下载所有依赖</p>
    <p><span>require()</span> 引用一个外部模块  <span>module.exports </span>暴露模块接口</p>

    <h3>第N天</h3>
    <p><span>调取txt文件</span>
    <br>var fs=require("fs")
    <br>fs.readFile("hello.txt",(err,data)=>{7
    <br>&nbsp;&nbsp;if(err){
    <br>&nbsp;&nbsp;&nbsp;&nbsp;onsole.log(err)
    <br>&nbsp;&nbsp;}
    <br>&nbsp;&nbsp;console.log(data.toString())    
    <br>})
    </p>
    <p><span>路径合成：</span>
    <br>var path=require("path")
    <br>var domain="http://www.baidu.com"
    <br>var url="docs"<br>var id="10"
    <br>address=path.join(domain,url,id)
    <br>console.log(address)
    <br><span>输出结果：http://www.baidu.com/docs/10</span>
    </p>

    <h3>第N天</h3>
    <p>请求：浏览器向服务器要数据</p>
    <p>响应：服务器给浏览器发送数据</p>
    <p>地址：我们可以通过域名或ip访问找到一个网站，域名或者ip就是这个网站的地址</p>
    <p>端口：一个ip或者一个域名可以找到一台服务器，但是这台服务器可以对外服务多个网站，他们的端口是不同127.0.0.1:8080</p>

    <h3>第N天</h3>
    <p>安装nodemon&nbsp;&nbsp; <span>nodemon会自动重启服务器</span>&nbsp;&nbsp;cnpm install nodemon -g
    <br><span>http模块</span>
    <br>var http=require("http")<span class="lv">//引用http模块</span>
    <br>var server=http.createServer((req,res)=>{
    <br>&nbsp;&nbsp;res.end("h1 style='color:red'five/h1")
    <br>})
    <br>server.listen(2019,()=>{<span class="lv">//设置监听端口</span>
    <br>&nbsp;&nbsp;console.log("http://197.0.0.1:2019")
    <br>})
    </p>

    <h3>第N天&nbsp;&nbsp;Koa</h3>
    <p>安装Koa&nbsp;&nbsp;<span>koa是框架</span>&nbsp;&nbsp;cnpm install koa --save</p>
    <p>第一步初始化服务器</p>
    <p>var Koa=require("koa");<span class="lv">//引用koa模块</span>
    <br>var app=new Koa();<span class="lv">//用构造函数创建一个koa应用</span>
    <br><span class="lv">//引用一个中间件，中间件就是一个函数</span>
    <br><span class="lv">//use方法内的函数会在请求和响应之间执行</span>
    <br>app.use(async (ctx)=>{
    <br>&nbsp;&nbsp;ctx.body="hello koa";
    <br>})
    <br>app.listen(3000,()=>{<span class="lv">//设置监听端口</span>
    <br>&nbsp;&nbsp;console.log("127.0.0.1:3000");
    <br>})
    </p>

    <h3>第N天&nbsp;&nbsp;koa-router</h3>
    <p>路由下载：<span>cnpm install --save koa-router</span></p>
    <p>get请求：用来获取页面或者数据</p>
    <p>post请求：用来提交数据，比如登录的时候，向后台发送用户名和密码</p>
    <p>
    var Koa=require("koa");<span class="lv">//引用koa模块</span>
    <br><span class="lv">//引用一个中间件，在koa项目中引入router</span>
    <br>var router=require("koa-router")();<span class="lv">//后面必须加括号</span>
    <br>var app=mew Koa();<span class="lv">//用构造函数创建一个koa应用</span>
    <br>app.listen(3000,()=>{<span class="lv">//设置监听端口</span>
    <br>&nbsp;&nbsp;console.log("127.0.0.1:3000");
    <br>})
    <br>app.use(router.routes());
    <br>router.get("/",async (ctx)=>{
    <br>&nbsp;&nbsp;ctx.body="h1这是淘宝首页/h1"
    <br>})
    <br>router.get("/shop",async (ctx)=>{
    <br>&nbsp;&nbsp;ctx.body="h1这是商品列表页/h1"
    <br>})
    </p>

    <h3>第N天&nbsp;&nbsp;koa-static</h3>
    <p>下载koa-static&nbsp;&nbsp;<span>cnpm install koa-static --save</span></p>
    <p>var Koa=require("koa");
    <br>var static=require("koa-static");
    <br>var app=new Koa();
    <br><span class="lv">//__dirname为当前目录的全部路径//创建静态目录img</span>
    <br>app.use(static(__dirname+"/指定路径"))
    </p>

    <h3>第N天&nbsp;&nbsp;引入html</h3>
    <p>安装koa-views<span> install koa-views --save</span></p>
    <p>安装nunjucks<span> install nunjucks --save</span></p>
    <p>var Koa=require("koa");
    <br>var views=require("koa-views");
    <br>var nunjucks=require("nunjucks");
    <br> app=new Koa();
    <br>app.use(views(__dirname+"/html文件路径",{
    <br>&nbsp;&nbsp;<span class="lv">//将使用nunjucks模块引擎渲染以html为后缀的文件</span>
    <br>&nbsp;&nbsp;map:{html:'nunjucks'}
    <br>}))
    <br>app.use(async cts=>{
    <br>&nbsp;&nbsp;<span class="lv">//render方法渲染模块，第二个参数可以给模块传递参数</span>
    <br>&nbsp;&nbsp;await ctx.render("html文件名")
    <br>})
    <br>app.listen("300",()=>{
    <br>&nbsp;&nbsp;console.log("成功")
    <br>})
    </p>

    <h3>第N天</h3>
    <p>获取form表单数据，query可以获取get请求的参数</p>
    <p>var text=ctx.query.text;<span class="lv">//获取text</span>
    <br>var password=ctx.query.password;<span class="lv">//获取password</span>
    </p>

    <h3>第N天 <span>post</span></h3>
    <p>将form表单提交属性改成<span>method="POST"</span></p>
    <p>下载koa-parser&nbsp;&nbsp;<span>cnpm install koa-parser --save</span></p>
    <p><span class="lv">//引用中间件我们就可以解析post提交的数据了</span>
    <br>var parser=require("koa-parser");
    <br>app.use(parser());
    <br>router.post("/html文件名",async ctx=>{
    <br>&nbsp;&nbsp;var text=ctx.request.body.text;
    <br>&nbsp;&nbsp;var password=ctx.request.body.password;
    <br>&nbsp;&nbsp;await ctx.render("index",{
    <br>&nbsp;&nbsp;&nbsp;&nbsp;console.log(text,password)
    <br>&nbsp;&nbsp;})
    <br>})
    </p>

    <h3>模板继承</h3>
    <p>分为公共页，和分页</p>
    <p>公共页：
    <br>【div】
    <br>&nbsp;&nbsp;【a href="/"】首页【/a】
    <br>&nbsp;&nbsp;【a href="/130"】图片页【/a】
    <br>&nbsp;&nbsp;【a href="/140"】文字页【/a】  
    <br>【/div】
    <br>{% block content %}
    <br>
    <br>{% endblock %}
    </p>
    <p>首页：
    <br>{% extends "./html/模板继承/layout.html"%}
    <br>{% block content %}
    <br>【h1】首页【/h1】
    <br>{% endblock %}
    </p>
    <p>图片：
    <br>{% extends "./html/模板继承/layout.html"%}
    <br>{% block content %}
    <br>【h1】图片【/h1】
    <br>{% endblock %}
    </p>
    <p>单独引用html文件
    <br>{% extends "./html/模板继承/layout.html"%}
    <br>{% block content %}
    <br>【h1】图片【/h1】
    <br><span>{% include "./路径html" %}</span>
    <br>{% endblock %}
    </p>

    <h3>第N天 cookies存在浏览器</h3>
    <p>router.get("/",async ctx=>{
    <br>&nbsp;&nbsp;<span class="lv">cookies是以名值对的方式记录在客户端</span>
    <br>&nbsp;&nbsp;ctx.cookies.set("user","1");
    <br>&nbsp;&nbsp;ctx.body=`【h1】cookies【/h1】【a href="/130"】变迁【/a】`
    <br>})
    </p>
    <p><span class="lv">通过页面刷新记录刷新次数</span>
    <br>router.get("/130",async ctx=>{
    <br>&nbsp;&nbsp;var count=ctx.cookies.get("count");
    <br>&nbsp;&nbsp;if(count>0){
    <br>&nbsp;&nbsp;&nbsp;&nbsp;count++
    <br>&nbsp;&nbsp;&nbsp;&nbsp;ctx.cookies.set("count",count,{
    <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="lv">2秒重置</span>
    <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;maxAge:2000
    <br>&nbsp;&nbsp;});
    <br>&nbsp;&nbsp;&nbsp;&nbsp;console.log(count)
    <br>&nbsp;&nbsp;}
    <br>&nbsp;&nbsp;else{
    <br>&nbsp;&nbsp;&nbsp;&nbsp;count=1;
    <br>&nbsp;&nbsp;&nbsp;&nbsp;console.log("456")
    <br>&nbsp;&nbsp;&nbsp;&nbsp;ctx.cookies.set("count",count);
    <br>&nbsp;&nbsp;}
    <br>&nbsp;&nbsp;ctx.body=count;
    <br>})
    </p>

    <h3>第N天 session存在服务器</h3>
    <p>下载koa-session &nbsp;&nbsp;cnpm install koa-session --save</p>
    <p>
    <br>var Koa=require("koa");
    <br>var session=require("koa-session");
    <br>var router=require("koa-router")();
    <br>var app=new Koa();
    <br><span class="lv">//session设置秘钥</span>
    <br>app.keys=['123456']
    <br><span class="lv">引用中间件session 并设置生存时间</span>
    <br>app.use(session({maxAge:10*1000},app))
    <br>router.get("/",async ctx=>{
    <br>&nbsp;&nbsp;<span class="lv">设置session</span>
    <br>&nbsp;&nbsp;ctx.session.admin="adimn"
    <br>&nbsp;&nbsp;ctx.body=`set session`
    <br>})
    <br>router.get("/session",async ctx=>{
    <br>&nbsp;&nbsp;<span class="lv">获取session</span>
    <br>&nbsp;&nbsp;var admin=ctx.session.admin;
    <br>&nbsp;&nbsp;ctx.body="[h1]"+admin+"[/h1]"
    <br>})
    </p>
</body>
</html>